<template>
	<div>
		<div class="box">
			<div class="title">产品方案</div>

			<uni-forms
				ref="form"
				:model="details"
				:rules="rules"
				:label-position="state == 'write' ? 'top' : 'left'"
				label-width="auto">
				<FromItem
					label="产品方案"
					:required="true"
					:state="state"
					name="schemeId"
					class="FromItem">
					<ASelectUni
						:dict="{
							list: deptList.scheme,
							label: 'schemeName',
							value: 'id',
						}"
						:disabled="state == 'disabled'"
						v-model="details.schemeId"
						@change="change_plan"
						:state="state"></ASelectUni>
				</FromItem>
				<FromItem
					label="产品名称"
					:required="true"
					state="readonly"
					name="schemeName">
					<text>{{ details.schemeName || '-' }}</text>
				</FromItem>
				<FromItem
					label="产品编号"
					:required="true"
					state="readonly"
					name="schemeCode">
					<text>{{ details.schemeCode || '-' }}</text>
				</FromItem>
				<FromItem
					label="用户类型"
					:required="true"
					:state="state"
					name="sourceBusinessType">
					<view v-if="state == 'readonly'">
						{{
							A_review({
								value: details.sourceBusinessType,
								dict: {
									list: dictList.sourceBusinessType,
								},
							})
						}}
					</view>
					<div v-else>
						<text v-if="config.applicableType != 0">
							{{
								details.sourceBusinessType
									| getSourceBusinessType(
										dictList.sourceBusinessType,
									)
							}}
						</text>
						<ASelectUni
							:dict="{
								list: dictList.sourceBusinessType,
							}"
							:state="state"
							v-else
							v-model="details.sourceBusinessType"></ASelectUni>
					</div>
				</FromItem>
				<FromItem
					label="车辆类型"
					:required="true"
					:state="state"
					name="carType">
					<view v-if="state == 'readonly'">
						{{
							A_review({
								value: details.carType,
								dict: {
									list: carTypeList,
								},
							})
						}}
					</view>
					<uni-data-checkbox
						v-else
						:disabled="state == 'disabled'"
						v-model="details.carType"
						:localdata="carTypeList"></uni-data-checkbox>
				</FromItem>
				<FromItem
					label="车辆来源"
					:required="true"
					:state="state"
					name="carSourceType">
					<view v-if="state == 'readonly'">
						{{
							A_review({
								value: details.carSourceType,
								dict: {
									list: carSourceTypeList,
								},
							})
						}}
					</view>
					<uni-data-checkbox
						v-else
						:disabled="state == 'disabled'"
						v-model="details.carSourceType"
						@change="change_carSourceType"
						:localdata="carSourceTypeList"></uni-data-checkbox>
				</FromItem>
				<FromItem
					v-if="details.carSourceType == '3'"
					label="外采方式"
					:required="true"
					:state="state"
					name="outsourcingType">
					<ASelectUni
						:state="state"
						:dict="{
							list: dict.type.quota_outsourcing,
						}"
						v-model="details.outsourcingType"></ASelectUni>
				</FromItem>
				<FromItem
					v-if="state == 'readonly'"
					label="额度编号"
					:required="true"
					:state="state"
					name="carSourceType">
					{{ details.calcSchemeCode || '' }}
				</FromItem>
			</uni-forms>
		</div>
	</div>
</template>

<script>
	import * as app from '@/api/index.js';
	import * as apis from '@/api/quota/apply/api.js';
	import FromItem from '../formItem/index.vue';
	export default {
		name: '',
		components: {
			FromItem,
		},
		dicts: ['quota_outsourcing'],
		props: {},
		inject: [
			'details_provide',
			'config_provide',
			'deptList_provide',
			'state_provide',
		],
		data() {
			return {
				a: '1',
				rules: {
					schemeId: {
						rules: [
							{
								required: true,
								errorMessage: '请选择产品方案！',
							},
						],
					},
				},

				dictList: {
					scheme: [],
					sourceBusinessType: [
						{
							text: '自营',
							value: '1',
						},
						{
							text: '渠道',
							value: '2',
						},
					],
				},
			};
		},
		computed: {
			details() {
				return this.details_provide();
			},
			config() {
				return this.config_provide();
			},
			deptList() {
				return this.deptList_provide();
			},
			state() {
				return this.state_provide();
			},
			carTypeList() {
				let arr = [
					{
						text: '新车',
						value: '1',
					},
					{
						text: '旧车',
						value: '2',
					},
				];
				if (this.notEmpty(this.config.vehicleSource)) {
					let planCarType = '';
					switch (this.config.vehicleSource?.toString()) {
						case '1':
							planCarType = '1';
							break;
						case '2':
							planCarType = '2';
							break;
						case '3':
							planCarType = '2';
							break;
						default:
							break;
					}
					arr.forEach(item => {
						if (item.value !== planCarType) {
							item.disabled = true;
						}
					});
				}
				return arr;
			},
			carSourceTypeList() {
				let arr = [
					{
						text: '自购',
						value: '1',
					},
					{
						text: '现有',
						value: '2',
					},
					{
						text: '外部转租赁',
						value: '3',
					},
				];
				if (this.details.carType == '1') {
					arr.splice(1, 1);
				}
				if (this.notEmpty(this.config.vehicleSource)) {
					let planCarSourceType = '';
					switch (this.config.vehicleSource?.toString()) {
						case '1':
							planCarSourceType = '1';
							break;
						case '2':
							planCarSourceType = '2';
							break;
						case '3':
							planCarSourceType = '1';
							break;
						default:
							break;
					}
					arr.forEach((item, index) => {
						if (
							item.value !== '3' &&
							item.value !== planCarSourceType
						) {
							item.disabled = true;
						}
					});
				}
				return arr;
			},
		},
		filters: {
			getSourceBusinessType(val, list) {
				let item = list.find(e => e.value === val);
				return item?.text ?? '-';
			},
		},
		created() {},
		mounted() {},
		methods: {
			change_plan({ val, item }) {
				this.$emit('setConfig', { item: item, type: 'changePlan' });
			},
			change_carSourceType() {
				this.details.outsourcingType = undefined;
				if (this.details.carSourceType !== '3') {
					this.details.salesContract = null;
					// insuranceConfList 外部转租赁上边的保险表格
				} else {
					// this.$emitter.emit('initDetaultInsurance'); //清空保险费用
				}
			},
		},
	};
</script>

<style lang="scss">
	.box {
		margin: 20rpx;
		padding: 20rpx;
		background-color: #fff;
		border-radius: 8rpx;

		.title {
			border-bottom: 1px solid #e9e9e9;
			font-weight: 500;
			padding-bottom: 10rpx;
			margin-bottom: 10rpx;
		}
	}
</style>
